<template>
  <div class="test-container">
    <div class="top-main">
      <search :listQuery="listQuery" :path="$route.name"></search>
    </div>
    <div class="bottom-main">
      <div class="list-button-group">
        <div class="button-item">
          <el-button type="primary" icon="el-icon-plus" @click="handleEdit">
            新增
          </el-button>
        </div>
      </div>
      <div class="table-list">
        <el-table
          v-loading="listLoading"
          :data="list"
          :element-loading-text="elementLoadingText"
          @selection-change="setSelectRows"
          highlight-current-row
          height="100%"
          :header-cell-style="{
            'border-bottom': '1px solid #cbcccd',
            'border-top': '1px solid #cbcccd',
          }"
        >
          <el-table-column
            show-overflow-tooltip
            type="selection"
          ></el-table-column>
          <el-table-column
            show-overflow-tooltip
            prop="leixingmc"
            label="类型名称"
          ></el-table-column>
          <el-table-column
            show-overflow-tooltip
            prop="leixingbm"
            label="类型编码"
          ></el-table-column>
          <el-table-column
            show-overflow-tooltip
            prop="paixu"
            label="排序"
          ></el-table-column>
          <!-- <el-table-column show-overflow-tooltip prop="xianchuwz" label="现处位置"></el-table-column>
          <el-table-column show-overflow-tooltip prop="shengchancj" label="生产厂家"></el-table-column>
          <el-table-column show-overflow-tooltip prop="chuchangrq" label="出厂日期"></el-table-column>
          <el-table-column show-overflow-tooltip prop="weiyibm" label="唯一编码"></el-table-column>
          <el-table-column show-overflow-tooltip prop="shiyongcs" label="使用次数"></el-table-column>
          <el-table-column show-overflow-tooltip prop="shengyucs" label="剩余次数"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guishufjh" label="归属飞机号"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guazaifjh" label="挂载飞机号"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guidingfxzq" label="规定返修周期"></el-table-column>
          <el-table-column show-overflow-tooltip prop="yucefxzq" label="预测返修周期"></el-table-column>
          <el-table-column show-overflow-tooltip prop="fanxiucj" label="返修厂家"></el-table-column>
          <el-table-column show-overflow-tooltip prop="xiuhouxlzq" label="修后修理周期"></el-table-column>
          <el-table-column show-overflow-tooltip prop="lishigzqk" label="历史故障情况"></el-table-column>
          <el-table-column show-overflow-tooltip prop="jishutblsqk" label="技术通报落实情况"></el-table-column>
          <el-table-column show-overflow-tooltip prop="jianxiurq" label="检修日期"></el-table-column>
          <el-table-column show-overflow-tooltip prop="xiacijxrq" label="下次检修日期"></el-table-column>
          <el-table-column show-overflow-tooltip prop="jianxiur" label="检修人"></el-table-column>
          <el-table-column show-overflow-tooltip prop="beizhu" label="备注"></el-table-column>
          <el-table-column show-overflow-tooltip prop="rukur" label="入库人"></el-table-column>
          <el-table-column show-overflow-tooltip prop="jingshour" label="经手人"></el-table-column>
          <el-table-column show-overflow-tooltip prop="chukur" label="出库人"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guadanghm" label="挂弹钩号码"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guadanccrq" label="挂弹钩出厂日期"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guadangshiycs" label="挂弹钩使用次数"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guadangshengycs" label="挂弹钩剩余次数"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guadangyj" label="挂弹钩预警"></el-table-column>
          <el-table-column show-overflow-tooltip prop="huojianfsq" label="火箭发射器"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guansl" label="管的数量"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guansm" label="管的寿命"></el-table-column>
          <el-table-column show-overflow-tooltip prop="yifascs" label="已发射次数"></el-table-column>
          <el-table-column show-overflow-tooltip prop="shengyucishu" label="剩余次数"></el-table-column>
          <el-table-column show-overflow-tooltip prop="yujing" label="到2次预警"></el-table-column>
          <el-table-column show-overflow-tooltip prop="tuopanid" label="托盘id"></el-table-column>
          <el-table-column show-overflow-tooltip prop="huoweiid" label="货位id"></el-table-column>
          <el-table-column show-overflow-tooltip prop="guajiazt" label="挂架状态">
            <template slot-scope="scope">
              {{ $util.getHwzt(scope.row.zhuangtai) }}
            </template>
</el-table-column>
<el-table-column show-overflow-tooltip prop="huojiaxz" label="货架类型">
  <template slot-scope="scope">
              {{ scope.row.huoweilx ? $util.getHwlx(scope.row.huoweilx) : '' }}
            </template>
</el-table-column>
<el-table-column show-overflow-tooltip prop="createName" label="创建人"></el-table-column>
<el-table-column show-overflow-tooltip prop="createTime" label="创建时间"></el-table-column> -->
          <el-table-column
            show-overflow-tooltip
            label="操作"
            fixed="right"
            min-width="100"
          >
            <template #default="{ row }">
              <el-button type="text" @click="handleEdit(row)">编辑</el-button>
              <el-button type="text" @click="handleDelete(row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <el-pagination
        background
        :current-page="listQuery.pageIndex"
        :page-size="listQuery.pageSize"
        :page-sizes="[10, 20, 30, 50]"
        :layout="layout"
        :total="total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      ></el-pagination>
    </div>
    <edit ref="edit" @fetch-data="fetchData"></edit>
  </div>
</template>

<script>
  let _listQuery = {
    pageIndex: 1,
    pageSize: 10,
    leixingmc: '',
    leixingbm: '',
    sort: 'paixu',
  }
  import search from './components/search.vue'
  import Edit from './components/pylonsManagementEdit'
  import { queryguajialx, delguajialx } from '@/api/cangkujichu'

  export default {
    name: 'LocationManagement',
    components: { Edit, search },
    data() {
      return {
        listQuery: Object.assign({}, _listQuery),
        list: null,
        listLoading: false,
        layout: 'total,sizes,prev, pager, next, jumper',
        total: 0,
        selectRows: '',
        elementLoadingText: '正在加载...',
      }
    },
    created() {
      this.fetchData()
    },
    methods: {
      setSelectRows(val) {
        this.selectRows = val
      },
      handleEdit(row) {
        if (row.id) {
          this.$refs['edit'].showEdit(row)
        } else {
          this.$refs['edit'].showEdit()
        }
      },
      handleDelete(row) {
        if (row.id) {
          this.$baseConfirm('你确定要删除当前项吗', null, async () => {
            const { msg } = await delguajialx({ id: row.id })
            this.$baseMessage('删除成功', 'success')
            this.fetchData()
          })
        } else {
          // if (this.selectRows.length > 0) {
          //   const ids = this.selectRows.map((item) => item.id).join()
          //   this.$baseConfirm('你确定要删除选中项吗', null, async () => {
          //     const { msg } = await doDelete({ ids })
          //     this.$baseMessage(msg, 'success')
          //     this.fetchData()
          //   })
          // } else {
          //   this.$baseMessage('未选中任何行', 'error')
          //   return false
          // }
        }
      },
      handleSizeChange(val) {
        this.listQuery.pageSize = val
        this.fetchData()
      },
      handleCurrentChange(val) {
        this.listQuery.pageIndex = val
        this.fetchData()
      },
      queryData() {
        this.listQuery.pageIndex = 1
        this.fetchData()
      },
      async fetchData() {
        const res = await queryguajialx(this.listQuery)
        this.list = res.data.rows
        this.total = res.data.total
      },
      add() {
        this.addshow = true
        this.gobacktitle = '新增'
      },
      search() {
        //搜索
        this.listQuery.pageIndex = 1
        this.fetchData()
      },
      resetlist() {
        //重置
        this.listQuery = Object.assign({}, _listQuery)
        this.fetchData()
      },
    },
  }
</script>
<style lang="scss" scoped>
  .test-container {
    display: flex;
    flex-direction: column;
    padding: 0 !important;
    background: #f6f8f9 !important;
    height: 100%;

    .top-main {
      width: 100%;
      background: #fff;
      padding: 10px 0;
    }

    .bottom-main {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      flex: 1;
      background-color: #fff;
      margin-top: 10px;
      padding-bottom: 10px;

      .list-button-group {
        display: flex;
        flex-direction: row;
        padding: 20px;

        .button-item {
          padding: 0px 10px;
        }

        .button-item:first-child,
        &:last-child {
          padding: 0px 10px 0 0;
        }
      }

      .table-list {
        flex: 1;
        padding: 0 20px 20px;
      }
    }

    .el-button {
      font-size: 0.14rem !important;
    }
  }
</style>
